<template>
    <div class="order">

        <!--地址-->
        <div >
            <van-button  size="large" v-on:click="selectAddress()">收货地址管理</van-button>
        </div>

      <!--  &lt;!&ndash;商品列表&ndash;&gt;
        <div v-for="goods in GoodsMessagesList" :key="goods">
            <van-card
                    :num="goods.num"
                    :price="goods.price"
                    :desc="goods.description"
                    :title="goods.name"
                    thumb="https://img.yzcdn.cn/vant/ipad.jpeg"
            >
                <template #tags>
                    <van-tag plain type="danger">标签</van-tag>
                    <van-tag plain type="danger">标签</van-tag>
                </template>
                <template #footer>
                    <van-button size="small" v-on:click="NumIncrease()">+</van-button>
                    <van-button size="small">- </van-button>
                </template>
            </van-card>
        </div>-->

        <van-card
                :num="goods.num"
                :price="goods.price"
                :desc="goods.description"
                :title="goods.name"
                :thumb="goods.picture"
        >

            <template #footer>
                <van-button size="small" v-on:click="NumIncrease()">+</van-button>
                <van-button size="small" v-on:click="NumDecrease()">- </van-button>
            </template>
        </van-card>

        <van-submit-bar :price="goods.price*100*goods.num" button-text="提交订单" @submit="onSubmit" />


    </div>
</template>

<script>
    import Vue from 'vue';
    import { AddressList } from 'vant';
    import {ApiService} from "../../axios/apiService";
    //import register from "../login/register";
    import { Toast } from 'vant';
    Vue.use(Toast);
    Vue.use(AddressList);
    export default {
        props: {
        },
        data(){
            return{
                sumPrice:0,
                goods:{
                    num:1,
                    price:0.0,
                    description:"",
                    title:"",
                    picture:"https://img.yzcdn.cn/vant/ipad.jpeg",
                    name:"",
                    sellerName:"",
                    stock_num:0,
                    sellerId:0,
                    id:0
                },
                orderId:0
              /*  GoodsMessagesList:[
                    {
                        name:"狗粮",
                        picture: "https://img14.360buyimg.com/n0/jfs/t1/118240/27/5634/117364/5eb4ce96E09e88f5e/90b1886cf260b3a9.jpg",
                        description: "台派 狗粮20KG40斤装泰迪金毛萨摩拉布拉多成犬幼犬小型中型大型犬通用型",
                        classification: "狗粮",
                        price: 109.00,
                        seller: "商城自营",
                        num:20,
                    },
                    {
                        name:"狗粮",
                        picture: "https://img14.360buyimg.com/n0/jfs/t1/118240/27/5634/117364/5eb4ce96E09e88f5e/90b1886cf260b3a9.jpg",
                        description: "台派 狗粮20KG40斤装泰迪金毛萨摩拉布拉多成犬幼犬小型中型大型犬通用型",
                        classification: "狗粮",
                        price: 109.00,
                        seller: "商城自营",
                        num:20,
                    },
                ]*/
            }
        },
        mounted() {
            this.getGoodsMessage()
        },
        methods:{
            onSubmit(){
                console.log("提交订单")
                const submitOrder =new ApiService("/submitOrder")

                console.log("buyerId:"+submitOrder.getCookie("userid"))
                console.log("sellerId:"+this.goods.sellerId)
                console.log("price:"+this.goods.price*this.goods.num)
                console.log("goodsId:"+this.goods.id)
                console.log("goodsNum:"+this.goods.num)
                submitOrder.getParams({
                    buyerId:submitOrder.getCookie("userid"),
                    sellerId:this.goods.sellerId,
                    price:this.goods.price*this.goods.num,
                    goodsId:this.goods.id,
                    goodsNum:this.goods.num,
                }).then(
                    res=>{
                        console.log(res.data)
                        if(res.data.code == 200){
                            this.orderId = res.data.data.id
                            Toast("订单创建成功...正在跳转到支付界面")
                            clearTimeout(this.timer);
                            this.timer = setTimeout(()=>{   //设置延迟执行
                                console.log('ok');
                                console.log("dddddddddddd")
                            },3000);
                            //TODO  不知道这两个参数怎么传
                            console.log("订单号发起支付"+
                                this.orderId)
                            this.pay(this.orderId)
                        }
                    }
                )


            },
            pay(order) {
                console.log(order)
                const api = new ApiService("/pay")
                api.getParams({
                    orderId:order
                }).then(res=> {
                    console.log("res"+res);
                    const div = document.createElement('div')
                    div.innerHTML = res.data
                    document.body.appendChild(div)
                    document.forms[0].submit()
                    //调用状态更新
                    console.log(order)
                    //this.updateType(order)
                })
                // api.getViewList().then(res => {
                //     console.log("res"+res);
                //     const div = document.createElement('div')
                //     div.innerHTML = res.data
                //     document.body.appendChild(div)
                //     document.forms[0].submit()
                //     //调用状态更新
                //     console.log(order,index)
                //     //this.updateType(order,index)
                // })

               /* api.getParams().then(
                    res => {
                        console.log("res"+res);
                        const div = document.createElement('div')
                        div.innerHTML = res.data
                        document.body.appendChild(div)
                        document.forms[0].submit()
                        //调用状态更新
                        console.log(order,index)
                        //this.updateType(order,index)
                    }
                )*/
            },
            NumIncrease(){
                if(this.goods.num<this.goods.stock_num){
                    this.goods.num++;
                }else {
                    Toast("库存只有这么多了哦！")
                }

            },
            NumDecrease(){
                if(this.goods.num>1){
                    this.goods.num--;
                }else{
                    Toast("该宝贝不能再少了哦！")
                }

            },
            selectAddress(){
                this.$router.push({name: "AddressManagement"})/*地址选择*/
            },
            getGoodsMessage(){
                console.log("获取商品信息")
                var goodsId = this.$route.params.goodsId
                console.log("goodsId ："+goodsId);
                const getGoods = new ApiService("/GoodsDetails");
                getGoods.getViewById(goodsId).then(res=>{
                    console.log("获取商品信息")
                    console.log(res.data)
                    this.goods.price = res.data.price;
                    this.goods.description = res.data.description;
                    this.goods.picture = res.data.pictureUrl;
                    this.goods.sellerName = res.data.sellerName;
                    this.goods.stock_num = res.data.stockNum;
                    this.goods.sellerId = res.data.sellerId;
                    this.goods.id = res.data.id;
                })
            }
        }
    };
</script>
<style>
    .van-bottom{
        margin-bottom: 1px;
    }
    .close-account {
        position: fixed;
        top: 83vh;
    }
</style>
